<template>
	<view>
		<view class="header__title">
		</view>
		<view class="container__success">
			<u-icon name="checkbox-mark" color="green" size="200"></u-icon>
		</view>
		<view class="footer__btn" @click="toHome">
			返回首页<text v-if="countDown!==0">{{countDown}}</text>
		</view>
	</view>
</template>

<script setup>
	import {
		onLoad,onUnload
	} from '@dcloudio/uni-app'
	import { ref } from 'vue'
	let countDown = ref(3)
	let timer = ref(null)
	function countDownFunction() {
		timer.value = setInterval(() => {
			countDown.value -=1
			if(countDown.value === 0) {
				clearInterval(timer.value)
				timer.value = null
				toHome()
			}
		},1000)
	}
	// 跳转到首页
	function toHome() {
		uni.switchTab({
			url: '/pages/index/index'
		})
	}
	onLoad(()=> {
		// 倒计时
		countDownFunction()
	})
	onUnload(()=> {
		if(timer.value) {
			clearInterval(timer.value)
			timer.value = null
		}
	})
</script>

<style lang="scss">
.header__title {
	text-align: center;
	padding-top: 50rpx;
	font-size: 40rpx;
}
.container__success{
	margin: 50rpx auto;
	width: fit-content;
}
.footer__btn{
	margin: 0 auto;
	text-align: center;
	width: fit-content;
	padding: 20rpx;
	border-radius: 8rpx;
	background-color: #1aac59;
	color: #ffff;
}
</style>
